@{
    ViewData["Title"] = "选择子箱";
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>@ViewData["Title"]</title>
    <link rel="stylesheet" href="~/layui/css/layui.css">
    <style>
        .search-panel {
            padding: 15px;
            background: #f8f8f8;
            margin-bottom: 10px;
        }
        .table-container {
            padding: 0 15px;
        }
        .status-draft { color: #ff5722; font-weight: bold; }
        .status-completed { color: #5fb878; font-weight: bold; }
        .info-panel {
            padding: 10px 15px;
            background: #e8f4fd;
            border-left: 4px solid #009688;
            margin-bottom: 15px;
            color: #666;
        }
    </style>
</head>
<body>
    <!-- 提示信息 -->
    <div class="info-panel">
        <i class="layui-icon layui-icon-tips"></i>
        只能选择状态为"草稿"且未被其他装箱作为子箱的装箱单
    </div>

    <!-- 搜索表单 -->
    <div class="search-panel">
        <form class="layui-form" lay-filter="searchForm">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">装箱编号</label>
                    <div class="layui-input-inline">
                        <input type="text" name="packingCode" placeholder="请输入装箱编号" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">客户编码</label>
                    <div class="layui-input-inline">
                        <input type="text" name="customerCode" placeholder="请输入客户编码" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">产品编码</label>
                    <div class="layui-input-inline">
                        <input type="text" name="productCode" placeholder="请输入产品编码" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <button type="button" class="layui-btn layui-btn-sm" id="btnSearch">
                        <i class="layui-icon layui-icon-search"></i> 搜索
                    </button>
                    <button type="reset" class="layui-btn layui-btn-primary layui-btn-sm">
                        <i class="layui-icon layui-icon-refresh"></i> 重置
                    </button>
                </div>
            </div>
        </form>
    </div>

    <!-- 数据表格 -->
    <div class="table-container">
        <table class="layui-table" lay-filter="subPackingTable" id="subPackingTable"></table>
    </div>

    <script src="~/Scripts/jquery-3.4.1.min.js"></script>
    <script src="~/layui/layui.js"></script>
    <script>
        layui.use(['table', 'form'], function(){
            var table = layui.table;
            var form = layui.form;
            var selectedSubPacking = null;

            // 获取URL参数
            function getUrlParam(name) {
                var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
                var r = window.location.search.substr(1).match(reg);
                if (r != null) return unescape(r[2]);
                return null;
            }

            var parentId = getUrlParam('parentId');

            // 表格渲染
            var tableIns = table.render({
                elem: '#subPackingTable',
                url: '/Packing/GetParentPackingSelectList',
                method: 'POST',
                where: { excludeId: parentId }, // 排除当前装箱
                page: true,
                request: {
                    pageName: 'page',
                    limitName: 'limit'
                },
                response: {
                    statusName: 'code',
                    statusCode: 0,
                    msgName: 'msg',
                    countName: 'count',
                    dataName: 'data'
                },
                cols: [[
                    {type: 'radio', width: 60},
                    {field: 'packingCode', title: '装箱编号', width: 180},
                    {field: 'packingDate', title: '装箱日期', width: 120, templet: function(d) {
                        return d.packingDate ? layui.util.toDateString(new Date(d.packingDate), 'yyyy-MM-dd') : '';
                    }},
                    {field: 'customerCode', title: '客户编码', width: 120},
                    {field: 'saleOrderCode', title: '销售订单', width: 120},
                    {field: 'productCode', title: '产品编码', width: 120},
                    {field: 'inspector', title: '检查员', width: 100},
                    {field: 'state', title: '状态', width: 80, templet: function(d) {
                        if(d.state === '0') return '<span class="status-draft">草稿</span>';
                        if(d.state === '1') return '<span class="status-completed">已完成</span>';
                        return '未知';
                    }},
                    {field: 'netWeight', title: '净重(kg)', width: 100, templet: function(d) {
                        return d.netWeight ? parseFloat(d.netWeight).toFixed(2) : '0.00';
                    }},
                    {field: 'grossWeight', title: '毛重(kg)', width: 100, templet: function(d) {
                        return d.grossWeight ? parseFloat(d.grossWeight).toFixed(2) : '0.00';
                    }}
                ]]
            });

            // 搜索
            $('#btnSearch').on('click', function() {
                var formData = form.val('searchForm');
                formData.excludeId = parentId; // 保持排除当前装箱
                tableIns.reload({
                    where: formData,
                    page: { curr: 1 }
                });
            });

            // 监听单选框选择
            table.on('radio(subPackingTable)', function(obj) {
                selectedSubPacking = obj.data;
                console.log('选中的子箱:', selectedSubPacking);
            });

            // 提供给父窗口调用的函数
            window.getSelectedSubPacking = function() {
                return selectedSubPacking;
            };
        });
    </script>
</body>
</html> 